<template>
    <!-- 无合同 -->
    <el-dialog :model-value="noContractApprovalDialogVisible" title="无合同入库审批附言" width="520"
        :before-close="noContractApprovalBeforeClose">
        <el-form ref="noContractApprovalRef" :model="noContractApprovalData" style="width: 100%" :inline="true"
            :rules="noContractApprovalules" label-width="120px" @submit.prevent>
            <el-row class="hm-row3" :gutter="60">
                <el-col :span="24">
                    <el-form-item label="补充合同日期" prop="supplementTime">
                        <el-date-picker v-model="noContractApprovalData.supplementTime" type="date"
                            value-format="YYYY-MM-DD" placeholder="请选择补充合同日期" style="width: 320px"
                            :disabled-date="disabledDate" />
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="审批附言" prop="recruiterRemark">
                        <el-input v-model="noContractApprovalData.recruiterRemark" type="textarea" maxlength="50"
                            :rows="4" style="width: 320px" />
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="noContractApprovalBeforeClose">取消</el-button>
                <el-button :loading="buttonLoading" type="primary"
                    @click="noContractApprovalHandleSave(noContractApprovalRef)">
                    确定
                </el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script setup name="NoContractApprovalDialog" lang="ts">
import { ElMessage, FormInstance } from 'element-plus'
import { type Action } from 'element-plus'
const props = defineProps(['noContractApprovalDialogVisible', 'id'])
const emit = defineEmits(['close', 'submit'])
import { noContractAdd } from '@/api/group/product/index'
const noContractApprovalRef = ref<FormInstance>()
const noContractApprovalData = ref({
    supplementTime: '',
    recruiterRemark: ''

})
const noContractApprovalules = ref({
    supplementTime: [
        { required: true, message: '请选择补充合同日期', trigger: 'change' },
    ],
    recruiterRemark: [
        { required: true, message: '请输入审批附言', trigger: 'blur' }
    ]
})
const buttonLoading = ref(false);
/** 日期禁用 */
const disabledDate = (time: any) => {
    return time.getTime() < Date.now() - 8.64e7; // 8.64e7 毫秒数代表一天
}
/** 关闭 */
const noContractApprovalBeforeClose = () => {
    noContractApprovalRef.value?.resetFields()
    emit('close')
}
/** 提交 */
const noContractApprovalHandleSave = async (formEl: FormInstance | undefined) => {
    if (!formEl) return
    await formEl.validate(async (valid, fields) => {
        if (valid) {
            ElMessageBox.confirm('是否确认发起无合同入库审批？', '提示', {
                confirmButtonText: '确认',
                cancelButtonText: '取消',
                callback: async (action: Action) => {
                    if (action == 'confirm') {
                        buttonLoading.value = true
                        try {
                            await noContractAdd({ ...noContractApprovalData.value, productsId: props.id, auditDeptId: '' })
                            ElMessage.success('无合同审批提交成功')
                            noContractApprovalRef.value?.resetFields()
                            buttonLoading.value = false
                            emit('submit')
                        } catch {
                            buttonLoading.value = false
                        }
                    }
                },
            })
        }
    })
}
</script>